<template>
	<view>
		<block v-for="(item,index) in list" :key="index">
			<uni-swiper-action :options="option" @click="bindClick($event,index)">
				<uni-list-item>
					<view class="text-secondary">
						<view class="d-flex a-center">
							<text class="main-text-color">{{item.name}}</text>
							{{item.phone}}
							<text v-if="item.isdefault" class="main-text-color">[默认]</text>
						</view>
						<view>
							{{item.area}}
						</view>
					</view>
					<view>
						{{item.detailArea}}
					</view>
				</uni-list-item>
			</uni-swiper-action>
		</block>
		<view class="bg-white cu-bar btn-group flex buttomGroup">
			<button class="cu-btn bg-gradual-red" style="height:150upx;" @click="gotoEdit">
				<text class="cuIcon-add" style="font-size: 150%;font-weight: bold;">新增地址</text>
			</button>
			<button class="cu-btn bg-gradual-pink" style="height:150upx;" @click="wxAddress">
				<text class="cuIcon-weixin" style="font-size: 150%;font-weight: bold;">微信获取</text>
			</button>
		</view>
	</view>

</template>

<script>
	import uniListItem from "../../../component/uni-ui/uni-list-item/uni-list-item.vue"
	import uniSwiperAction from "@/component/uni-ui/uni-swipe-action/uni-swipe-action.vue"
	import {
		mapState
	} from "vuex"
	import {
		mapMutations
	} from "vuex"
	export default {
		components: {
			uniSwiperAction,
			uniListItem
		},
		computed: {
			...mapState({
				list: state => state.area.list
			}),
		},
		data() {
			return {
				lsit:[],
				option: [{
					text: "修改",
					style: {
						backgroundColor: "#007aff",
					}
				}, {
					text: "删除",
					style: {
						backgroundColor: "#dd524d",
					}
				}],
				modalName: null,
				textName: null,
				textPhone: null,
				textHome: null,
			}
		},
		onLoad() {
			this.getAct();
		},
		methods: {
			getAct(){
				this.request({
					url:this.apiServer + 
					"/address/findAddressByUId?uId="+
					uni.getStorageSync("user").id
				}).then(res=>{
					console.log(res);
				})
			},
			//创建地址页面跳转
			gotoEdit(e) {
				uni.navigateTo({
					url: "mine-area-edit"
				});
			},
			//微信获取地址
			wxAddress(){
				var that = this;
				wx.getSetting({
					success:(res)=>{
						const scopeAddress = res.authSetting["scope.address"]
						if(scopeAddress===true||scopeAddress===undefined){
							wx.chooseAddress({
								success:function(res){
									var area = res.provinceName+" "+res.cityName+" "+res.countyName;
									var address = {
										"name":res.userName,
										"phone":res.telNumber,
										"area":area,
										"detailArea":res.detailInfo,
										"isdefault":false
									};
									that.list.push(address);
								},
								fail:()=>{
									this.openConfirm()
								}
							})
						}else{
							wx.openSetting({
								success:(res)=>{
									wx.chooseAddress({
										success:function(res){
											var area = res.provinceName+" "+res.cityName+" "+res.countyName;
											var address = {
												"name":res.userName,
												"phone":res.telNumber,
												"area":area,
												"detailArea":res.detailInfo,
												"isdefault":false
											};
											that.list.push(address);
										},
									})
								}
							})
						}
					}
				})
				
			},

			//获取方法
			...mapMutations(['delArea']),
			//
			bindClick(e, index) {
				switch (e.index) {
					//修改
					case 0:
						let obj = JSON.stringify({
							index: index,
							item: this.list[index]
						})
						setTimeout(() => {
							uni.navigateTo({
								url: "mine-area-edit?data=" + obj,
							});
						}, 50)
						break;
						//删除
					case 1:
						uni.showModal({
							content: "要删除吗",
							success: (res) => {
								if (res.confirm) {
									this.delArea(index)
									uni.showToast({
										title: "删除成功"
									});
								}
							}
						});

						break;
				}
			}
		}
	}
</script>

<style>
.buttomGroup{
	position: fixed;
	  width: 100%;
	  height: 200upx;
	  bottom:0px;
}
</style>
